<!doctype html>
<meta charset="utf8">
<link rel="help" href="https://www.w3.org/TR/payment-request/#paymentaddress-interface">
<title>
  PaymentResponse.prototype.shippingAddress
</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../payment-response/helpers.js"></script>
<script>
const options = { requestShipping: true };
function runManualTest(button, expected = {}) {
  button.disabled = true;
  promise_test(async () => {
    const { response } = await getPaymentRequestResponse(options);
    await response.complete();
    assert_idl_attribute(response, "shippingAddress");
    const { shippingAddress: addr } = response;
    assert_true(
      addr instanceof PaymentAddress,
      "Expect instance of PaymentAddress"
    );
    // An [ISO3166] alpha-2 code. The canonical form is upper case.
    const { country } = addr;
    assert_equals(country.length, 2, "Expected length is 2");
    assert_true(/^[A-Z]{2}$/.test(country), "Canonical form is upper case");
    assert_true(
      addr.addressLine instanceof Array,
      "Expected addressLine to be an array"
    );
    assert_throws_js(
      TypeError,
      () => {
        addr.addressLine.push("this must throw");
      },
      "Array must be frozen"
    );
    for (let [attr, expectedValue] of Object.entries(expected)) {
      assert_idl_attribute(addr, attr);
      const msg = `Expected paymentAddress.${attr} to equal ${expectedValue}.`;
      //.toString() flattens array addressLine,
      //.toLowerCase() because case can't be enforced for some attributes
      const actualValue = addr[attr].toString().toLowerCase();
      expectedValue = expectedValue.toString().toLowerCase();
      assert_equals(actualValue, expectedValue, msg);
    }
    // Check toJSON result
    for (let [prop, jsonValue] of Object.entries(addr.toJSON())) {
      const actualValue = jsonValue.toString().toLowerCase();
      const expectedValue = expected[prop].toString().toLowerCase();
      const msg = `Expected JSON ${prop} to be ${expectedValue}`;
      assert_equals(actualValue, expectedValue, msg);
    }
  }, button.textContent.trim());
  done();
}
</script>
<h2>PaymentAddress interface</h2>
<p>
  Click on each button in sequence from top to bottom without refreshing the page.
  Each button will bring up the Payment Request UI window.
</p>
<p>
  When prompted, please enter addresses as follows...
</p>
<ol>
  <li>
    <button onclick="
    const expectedAddress = {
      country: 'AU',
      regionCode: 'QLD',
      addressLine: '55 test st',
      city: 'Chapel Hill',
      dependentLocality: '',
      postalCode: '6095',
      region: 'QLD',
      sortingCode: '',
      organization: 'w3c',
      recipient: 'web platform test',
      phone: '+61733780000',
    };
    runManualTest(this, expectedAddress);">
      If the requestShipping member is true, then shippingAddress's PaymentAddress must match the expected values.
    </button>
    Please use:
    <dl>
      <dt>Recipient:</dt>
      <dd>web platform test</dd>
      <dt>Address line:</dt>
      <dd>55 test st</dd>
      <dt>Country</dt>
      <dd>Australia</dd>
      <dt>City</dt>
      <dd>Chapel Hill</dd>
      <dd>State/Region</dd>
      <dd>Queensland</dd>
      <dt>postal code </dt>
      <dd>6095</dd>
      <dt>organization</dt>
      <dd>w3c</dd>
      <dt>Phone number</dt>
      <dd>+61 7 3378 0000</dd>
    </dl>
  </li>
</ol>
<small>
  If you find a buggy test, please <a href="https://github.com/web-platform-tests/wpt/issues">file a bug</a>
  and tag one of the <a href="https://github.com/web-platform-tests/wpt/blob/master/payment-request/META.yml">suggested reviewers</a>.
</small>
